<template>
    <div class="app-container">
      <!-- 耗材资料 -->
      <!-- 查询和其他操作 -->
      <el-form :inline="true" class="demo-form-inline filter">
        <div>
          <el-form-item label="客户名称">
            <el-select v-model="listQuery.fsiteNo" :disabled="this.$store.state.user.fsiteLevel==3" clearable filterable placeholder="请选择客户名称">
              <el-option
                v-for="item in fsiteNoBelongOptions"
                :key="item.value"
                :label="item.label"
                :value="item.value"/>
            </el-select>
          </el-form-item>
          <el-form-item label="耗材信息">
            <el-input v-model="listQuery.fcasno" clearable class="filter-item" placeholder="请输入物料信息" />
          </el-form-item>
          <el-form-item label="耗材分类">
            <el-select v-model="listQuery.fclassstno" placeholder="请选择耗材分类" class="filter-item" clearable>
              <el-option v-for="item in fclassstnoOptions" :key="item.fclassstno" :label="item.fclassstname" :value="item.fclassstno" />
            </el-select>
          </el-form-item>
        </div>
        <el-form-item>
          <el-button
            :style="{ background: buttonColor.lookup, color: buttonColor.color }"
            round
            size="medium"
            class="filter-item"
            @click="handleFilter">查找</el-button>
          <el-button
            :style="{ background: buttonColor.add, color: buttonColor.color }"
            round
            size="medium"
            class="filter-item"
            @click="handleCreate">添加</el-button>
          <el-button
            :style="{ background: buttonColor.import, color: buttonColor.color }"
            round
            size="medium"
            @click="handleUpload">导入</el-button>
        </el-form-item>
      </el-form>
  
      <!-- 查询结果 -->
      <el-table
        v-loading="listLoading"
        :height="buttonColor.clientHeightTwo"
        :data="list"
        :header-cell-style="tableColor"
        stripe
        element-loading-text="正在查询中。。。"
        border
        fit
        highlight-current-row>
        <el-table-column :width="buttonColor.operationThree" align="center" label="操作" class-name="small-padding">
          <template slot-scope="scope">
            <div class="operationButton">
              <div :style="{ color: buttonColor.edit, cursor: 'pointer' }" @click="handleUpdate(scope.row)">
                <img src="../../../public/images/edit.png" >
                编辑
              </div>
              <div :style="{ color: buttonColor.delete, cursor: 'pointer' }" @click="handleDelete(scope.row)">
                <img src="../../../public/images/del.png" >
                删除
              </div>
              <div :style="{ color: buttonColor.tag, cursor: 'pointer' }" @click="labelTag(scope.row)">
                <img src="../../../public/images/tag.png" >
                标签
              </div>
            </div>
          </template>
        </el-table-column>
        <el-table-column :width="buttonColor.line" :index="indexMethod" align="center" label="序" type="index" />
        <el-table-column :width="buttonColor.billno" align="left" label="耗材编号" prop="fmaterialno" />
        <el-table-column :width="buttonColor.name" align="left" label="耗材名称" prop="fmaterialname" />
        <el-table-column align="left" label="耗材条码" prop="fbarcode" />
        <el-table-column width="150" align="left" label="英文名称" prop="fengname" />
        <el-table-column :formatter="formatfclassstno" align="left" label="耗材分类" prop="fclassstno" />
        <el-table-column align="left" label="型号" prop="fspec" />
      </el-table>
  
      <pagination
        v-show="total > 0"
        :total="total"
        :page.sync="listQuery.page"
        :limit.sync="listQuery.limit"
        @pagination="getList" />
  
      <!-- 添加或修改对话框 -->
      <el-dialog :close-on-click-modal="false" :before-close="handleClose" :visible.sync="dialogFormVisible" width="auto">
        <template slot="title">
          <div :style="titleColor">{{ textMap[dialogStatus] }}</div>
        </template>
        <el-form ref="dataForm" :rules="rules" :model="dataForm" status-icon label-position="left" label-width="90px">
          <el-row>
            <el-col :span="8">
              <el-form-item class="required" label="耗材编号" prop="fmaterialno">
                <el-input v-if="dialogStatus == 'create'" v-model="dataForm.fmaterialno" />
                <el-input v-else v-model="dataForm.fmaterialno" disabled />
              </el-form-item>
            </el-col>
            
            <el-col :span="8">
              <el-form-item class="required" label="耗材分类" prop="fclassstno">
                <el-select v-model="dataForm.fclassstno" class="filter-item" clearable>
                  <el-option
                    v-for="item in fclassstnoOptions"
                    :key="item.fclassstno"
                    :label="item.fclassstname"
                    :value="item.fclassstno" />
                </el-select>
              </el-form-item>
            </el-col>

            <el-col :span="8">
              <el-form-item class="required" label="耗材状态" prop="fmaterialstate">
                <el-select v-model="dataForm.fmaterialstate" class="filter-item" clearable>
                  <el-option
                    v-for="item in fgoodstateOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value" />
                </el-select>
              </el-form-item>
            </el-col>
  
          </el-row>
  
          <el-row>
            <el-col :span="8">
              <el-form-item class="required" label="耗材名称" prop="fmaterialname">
                <el-input v-model="dataForm.fmaterialname" />
              </el-form-item>
            </el-col>
  
            <el-col :span="8">
              <el-form-item label="型号" prop="fspec">
                <el-input v-model="dataForm.fspec" />
              </el-form-item>
            </el-col>

            <el-col :span="8">
              <el-form-item label="耗材条码" prop="fbarcode">
                <el-input v-model="dataForm.fbarcode" />
              </el-form-item>
            </el-col>
            
          </el-row>
          <el-row>
            <el-col :span="8">
              <el-form-item label="英文名称" prop="fengname">
                <el-input v-model="dataForm.fengname" />
              </el-form-item>
            </el-col>
  
            <el-col :span="8">
              <el-form-item label="保质期" prop="feffday">
                <el-input v-model.number="dataForm.feffday" />
              </el-form-item>
            </el-col>

            <el-col :span="8">
              <el-form-item class="required" label="采购价" prop="fbuyprice">
                <el-input v-model="dataForm.fbuyprice" />
              </el-form-item>
            </el-col>

          </el-row>
          <el-row>
  
            <el-col :span="8">
              <el-form-item class="required" label="库存单位" prop="funit">
                <el-input v-model="dataForm.funit" />
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="换算系数" prop="fordpack">
                <el-input v-model="dataForm.fordpack" />
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="采购单位" prop="fordunit">
                <el-input v-model="dataForm.fordunit" />
              </el-form-item>
            </el-col>
          </el-row>
  
          <el-row>
            <el-col :span="8">
              <el-form-item label="安全库存" prop="fsafeqty">
                <el-input v-model.number="dataForm.fsafeqty" />
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="最高库存" prop="fheightqty">
                <el-input v-model.number="dataForm.fheightqty" />
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="管制物品" prop="fdanger">
                <el-select v-model="dataForm.fdanger" class="filter-item" clearable>
                  <el-option
                    v-for="item in fdangerOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value" />
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
         
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button
            :style="{ background: buttonColor.cancel, color: buttonColor.colorone }"
            round
            size="medium"
            @click="cancel()">取消</el-button>
          <el-button
            v-if="dialogStatus == 'create'"
            :style="{ background: buttonColor.confirm, color: buttonColor.color }"
            round
            size="medium"
            @click="createData">确定</el-button>
          <el-button
            v-else
            :style="{ background: buttonColor.confirm, color: buttonColor.color }"
            round
            size="medium"
            @click="updateData">确定</el-button>
        </div>
      </el-dialog>
  
      <!-- 标签页 -->
      <el-dialog :close-on-click-modal="false" :visible.sync="dialogFormVisibleLabelTag" width="auto">
        <template slot="title">
          <div :style="titleColor">{{ textMap[dialogStatus] }}</div>
        </template>
        <el-form ref="dataForm" :rules="rules" :model="dataForm" status-icon label-position="left" label-width="90px">
          <el-row>
            <el-col :span="8">
              <el-form-item label="耗材编号" prop="fmaterialno">
                <el-input v-model="dataForm.fmaterialno" disabled />
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="耗材状态" prop="fgoodstate">
                <el-select v-model="dataForm.fgoodstate" disabled class="filter-item" clearable>
                  <el-option
                    v-for="item in fgoodstateOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value" />
                </el-select>
              </el-form-item>
            </el-col>
  
          </el-row>
  
          <el-row>
            <el-col :span="8">
              <el-form-item label="耗材名称" prop="fgoodname">
                <el-input v-model="dataForm.fgoodname" disabled />
              </el-form-item>
            </el-col>
            
            <el-col :span="8">
              <el-form-item label="耗材分类" prop="fclassstno">
                <el-select v-model="dataForm.fclassstno" disabled class="filter-item" clearable>
                  <el-option
                    v-for="item in fclassstnoOptions"
                    :key="item.fclassstno"
                    :label="item.fclassstname"
                    :value="item.fclassstno" />
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
        <div :style="{ width: '100%', display: 'flex', border: '2px solid #F2F2F2', height: panelHeight }">
          <el-tabs style="width: 100%" type="border-card">
            <el-tab-pane label="容器标签">
              <div class="app-container">
                <el-table
                  v-loading="listLoading"
                  :height="panelHeight"
                  :data="dataForm.details4"
                  :header-cell-style="tableColor"
                  stripe
                  element-loading-text="正在查询中。。。"
                  border
                  fit
                  highlight-current-row>
                  <el-table-column align="left" label="标签码" prop="fbarcode" />
                  <el-table-column align="left" label="生产日期" prop="fbegdate" />
                  <el-table-column align="left" label="停用日期" prop="fenddate" />
                </el-table>
              </div>
            </el-tab-pane>
          </el-tabs>
        </div>
  
        <div slot="footer" class="dialog-footer">
          <el-button
            :style="{ background: buttonColor.cancel, color: buttonColor.colorone }"
            round
            @click="dialogFormVisibleLabelTag = false">取消</el-button>
        </div>
      </el-dialog>
  
      <!-- 导出弹窗 -->
      <el-dialog :close-on-click-modal="false" :visible.sync="uploadVisible" width="auto">
        <template slot="title">
          <div :style="exportColor">耗材资料</div>
        </template>
        <div style="width:300px;height:200px;display: flex;flex-direction: column;align-items: center">
          <el-upload
            :on-success="uploadFileSuccess"
            :headers="headers"
            :action="uploadPath2"
            :data="{ 'tableName': 'Import_i_ts_good_info' }"
            :show-file-list="false"
            class="filter-item"
            style="margin-top:20px"
            accept=".xlsx">
            <el-button
              :style="{ background: buttonColor.import, color: buttonColor.color }"
              round
              size="medium"
              icon="el-icon-upload">导入</el-button>
          </el-upload>
          <div style="margin-top:30px;text-decoration:underline">
            <a :href="downUrl" style="color: blue">模板文件下载</a>
          </div>
  
        </div>
      </el-dialog>
      <material
        :material-id-visible.sync="materialIdVisible"
        :fsite-no.sync="materialFsiteNo"
        :table-color="tableColor"
        @materialDialog="materialDialogValue" />
    </div>
  </template>
  
  <style>
  .button-margin {
    margin: 2px 0px;
  }
  
  .el-button+.el-button {
    margin-left: 1px;
  }
  </style>
  
  <script>
  import {listgoodInfo,creategoodInfo,updategoodInfo, deletegoodInfo} from '@/api/haocai/goodInfo'
  import {listgoodClass} from "@/api/haocai/goodClass"
  import { fsiteOptionsByLevel, getListArea, uploadPath2 } from '@/api/area'
  import { getToken } from '@/utils/auth'
  import Pagination from '@/components/Pagination'
  import Material from '@/components/Material'
  import { uploadPath } from '@/api/room'
  import moment from 'moment'
  import { tableColor, titleColor, exportColor, buttonColor } from '@/filters/index'
  import { getApiUrl } from '@/utils/request'
  export default {
    name: 'ITsGoodInfo',
    components: { Pagination, Material },
    data() {
      return {
        fdangerOptions: [
          {label:'是',value:1},
          {label:'否',value:0},
        ],
        fsiteNoBelongOptions: [], // 客户列表
        dialogFormVisibleLabelTag: false, // 标签页弹窗是否显示
        isAdd1: true,
        activeName: 'first',
        panelHeight: 0,
        downUrl: null,
        uploadVisible: false,
        uploadPath2,
        heddon: false,
        uploadPath,
        isActive: true,
        materialIdVisible: false,
        materialFsiteNo: null,
        fstorageflagOptions: [],
        fclassstnoOptions: [],
        dialogFormVisible1: false,
        dialogStatus1: null,
        detailsTmp: [],
        listTmp: [],
        dataForm1: {
          fline: undefined,
          fgoodno: undefined,
          fattribute: undefined
        },
  
        dialogFormVisible2: false,
        dialogStatus2: null,
        detailsTmp2: [],
        listTmp2: [],
        dataForm2: {
          fgoodno: undefined,
          fimgname: undefined,
          fimgscript: undefined,
          fimage: undefined
        },
  
        dialogFormVisible3: false,
        dialogStatus3: null,
        detailsTmp3: [],
        listTmp3: [],
        dataForm3: {
          fbarcode: undefined,
          fbegdate: undefined,
          fenddate: undefined
        },
  
        list: null,
        total: 0,
        listLoading: true,
        listQuery: {
          page: 1,
          limit: 20,
          fgoodno: undefined,
          fsiteNo: this.$store.state.user.fsiteNo,
          fgoodname: undefined,
          fcasno: undefined,
          fbarcode: undefined,
          fengname: undefined,
          fclassstno: undefined,
          fspec: undefined,
          funit: undefined,
          feffday: undefined,
          fpurity: undefined,
          fbuyprice: undefined,
          fstorageflag: undefined,
          fsafeqty: undefined,
          fheightqty: undefined,
          fsafecard: undefined,
          fgoodstate: undefined,
          fupddate: undefined,
          foperator: undefined,
          sort: 'create_time',
          order: 'desc'
        },
        dataForm: {
          fsiteNo: undefined,
          fgoodno: undefined,
          fgoodname: undefined,
          fmaterialname:'12',
          fmaterialno:'1001',
          fmaterialstate:'0',
          fordpack:'1',
          fsupno:'1',
          fcasno: undefined,
          fbarcode: undefined,
          fengname: undefined,
          fclassstno: undefined,
          fspec: undefined,
          funit: undefined,
          fordunit: 1,
          feffday: undefined,
          fpurity: undefined,
          fbuyprice: 0,
          fstorageflag: undefined,
          fsafeqty: undefined,
          fheightqty: undefined,
          fsafecard: undefined,
          fgoodstate: undefined,
          fupddate: undefined,
          foperator: undefined,
          fdanger: undefined,
          id: undefined,
          fdensity: undefined,
          details: [],
          details2: [],
          details3: [],
          details4: []
        },
        actionsTmp3: undefined,
        tableColor,
        titleColor,
        exportColor,
        buttonColor: buttonColor,
        dialogFormVisible: false,
        dialogStatus: '',
        textMap: {
          update: '编辑',
          create: '创建'
        },
        rules: {
          fgoodno: [{ required: true, message: '物料编号不能为空' }],
          fgoodname: [{ required: true, message: '物料名称不能为空' }],
          fclassstno: [{ required: true, message: '物料分类不能为空' }],
          feffday: [{ type: 'number', message: '保质期必须为数字值' }],
          fstorageflag: [{ required: true, message: '存储分类不能为空' }],
          fsafeqty: [{ type: 'number', message: '安全库存必须为数字值' }],
          fheightqty: [{ type: 'number', message: '最高库存必须为数字值' }],
          fgoodstate: [
            { required: true, message: '物料状态不能为空' },
            { type: 'number', message: '物料状态必须为数字值' }
          ],
          funit: [{ required: true, message: '库存单位不能为空' }],
          fbuyprice: [{ required: true, message: '市场价不能为空' }]
        },
        rules1: {
          fline: [{ required: true, message: '行号不能为空', trigger: 'blur' }],
          fgoodno: [{ required: true, message: '物料编号不能为空', trigger: 'blur' }],
          fattribute: [{ required: true, message: '物料性质不能为空', trigger: 'change' }]
        },
        rules2: {
          fgoodno: [{ required: true, message: '物料编号不能为空' }],
          fimgname: [{ required: true, message: '图片名称不能为空' }]
        },
        rules3: {
          fbarcode: [{ required: true, message: '标签页不能为空' }],
          fbegdate: [{ required: true, message: '生产日期不能为空' }],
          fenddate: [{ required: true, message: '停用日期不能为空' }]
        },
        fgoodstateOptions: [
          { value: 1, label: '正常' },
          { value: 0, label: '淘汰' }
        ]
      }
    },
    computed: {
      headers() {
        return {
          'Authorization': getToken()
        }
      }
    },
    created() {
      this.panelHeight = document.documentElement.clientHeight - 420
      // 客户列表
      fsiteOptionsByLevel(3)
        .then(response => {
          this.fsiteNoBelongOptions = response.data.data.list
        })
        .catch(() => {
          this.fsiteNoBelongOptions = []
        })
      this.downUrl = getApiUrl() + 'xlsx/1-2物料资料.xlsx'
      this.getList()
  
      // 物料分类
      listgoodClass({fsiteNo:this.$store.state.user.fsiteNo})
      .then(res=>{
        this.fclassstnoOptions = res.data.data.list
      })
      .catch(()=>{
        this.fclassstnoOptions = []
      })
      // getListArea({ flag: 29,arg1: this.$store.state.user.fsiteNo })
      //   .then((response) => {
      //     this.fclassstnoOptions = response.data.data.list
      //   })
      //   .catch(() => {
      //     this.fclassstnoOptions = []
      //   })
      // 存储分类
      getListArea({ flag: 28 })
        .then((response) => {
          this.fstorageflagOptions = response.data.data.list
        })
        .catch(() => {
          this.fstorageflagOptions = []
        })
    },
    methods: {
      uploadFileSuccess: function(response) {
        this.uploadVisible = false
        this.$notify.success({
          title: '导入',
          dangerouslyUseHTMLString: true,
          message: response.data
        })
      },
      handleUpload() {
        this.uploadVisible = true
      },
      limits() {
        if (this.dataForm.fequipmentno != undefined && this.dataForm.fequipmentno != '') {
          this.isActive = false
        } else {
          this.isActive = true
        }
      },
      test() {
        if (this.isActive) {
          this.$notify.error({
            title: '失败',
            message: '请先输入物料编号'
          })
        }
      },
      datetimeFormat(row, column) {
        const date = row[column.property]
        if (date === undefined || date === null) {
          return ''
        }
        return moment(date).format('YYYY-MM-DD HH:mm:ss')
      },
  
      handleClick(tab, event) {
        this.activeName = tab.name
        if (tab.name === 'second') {
          this.handleUpdate2()
        } else if (tab.name === 'fourth') {
          this.handleUpdate3()
        } else if (tab.name === 'first') {
          this.handleUpdate1()
        }
      },
  
      // 物料分类
      formatfclassstno: function(row, column) {
        if (this.fclassstnoOptions.length > 0) {
          for (let i = 0; i < this.fclassstnoOptions.length; i++) {
            if (row.fclassstno === this.fclassstnoOptions[i].fclassstno) {
              return this.fclassstnoOptions[i].fclassstname
            }
          }
          return ''
        } else {
          return ''
        }
      },
      // 存储分类
      formatfstorageflag: function(row, column) {
        if (this.fstorageflagOptions.length > 0) {
          for (let i = 0; i < this.fstorageflagOptions.length; i++) {
            if (row.fstorageflag === this.fstorageflagOptions[i].value) {
              return this.fstorageflagOptions[i].label
            }
          }
          return ''
        } else {
          return ''
        }
      },
      getList() {
        this.listLoading = true
        listgoodInfo(this.listQuery)
          .then((response) => {
            this.list = response.data.data.list
            this.total = response.data.data.total
            this.listLoading = false
          })
          .catch(() => {
            this.list = []
            this.total = 0
            this.listLoading = false
          })
      },
      handleFilter() {
        this.listQuery.page = 1
        this.getList()
      },
      resetForm() {
        this.dataForm = {
          fgoodno: undefined,
          fgoodname: undefined,
          fcasno: undefined,
          fbarcode: undefined,
          fengname: undefined,
          fclassstno: undefined,
          fspec: undefined,
          funit: undefined,
          feffday: undefined,
          fpurity: undefined,
          fbuyprice: 0,
          fstorageflag: undefined,
          fsafeqty: undefined,
          fheightqty: undefined,
          fsafecard: undefined,
          fgoodstate: undefined,
          fupddate: undefined,
          foperator: undefined,
          fdanger: undefined,
          id: undefined,
          fdensity: undefined,
          details: [],
          details2: [],
          details3: undefined,
          details4: []
        }
      },
      resetForm1() {
        this.dataForm1 = {
          fline: undefined,
          fgoodno: undefined,
          fattribute: undefined
        }
      },
      handleCreate() {
        this.resetForm()
        this.resetForm1()
  
        this.activeName = 'first'
        this.dialogStatus = 'create'
        this.dataForm.fgoodstate = 1
        this.dataForm.feffday = 999
        this.dataForm.fsiteNo = this.$store.state.user.fsiteNo
        if (this.fclassstnoOptions.length > 0) {
          this.dataForm.fclassstno = this.fclassstnoOptions[0].value
        }
        if (this.fstorageflagOptions.length > 0) {
          this.dataForm.fstorageflag = this.fstorageflagOptions[0].value
        }
        this.dialogFormVisible = true
        // this.$nextTick(() => {
        //   this.$refs['dataForm'].clearValidate()
        // })
        this.dataForm1.fline = 1
        this.dataForm.fdanger = 0
        this.handleUpdate1()
      },
      createData() {
        this.$refs['dataForm'].validate((valid) => {
          if (valid) {
            creategoodInfo(this.dataForm)
              .then((response) => {
                this.list.unshift(response.data.data)
                this.dialogFormVisible = false
                this.$notify.success({
                  title: '成功',
                  message: '添加物品资料成功'
                })
              })
              .catch((response) => {
                this.$notify.error({
                  title: '失败',
                  message: response.data.data
                })
              })
          }
        })
      },
      handleUpdate(row) {
        this.dataForm = Object.assign({}, row)
        this.activeName = 'first'
        for (let i = 0; i < row.details4.length; i++) {
          if (row.details4[i]['fbegdate'] != null) {
            row.details4[i]['fbegdate'] = moment(row.details4[i]['fbegdate']).format('YYYY-MM-DD')
          }
          if (row.details4[i]['fenddate'] != null) {
            row.details4[i]['fenddate'] = moment(row.details4[i]['fenddate']).format('YYYY-MM-DD')
          }
        }
        this.dialogStatus = 'update'
        this.dialogFormVisible = true
        this.detailsTmp = []
        this.listTmp = row
        row.details.forEach((v) => {
          this.detailsTmp.push(v)
        })
  
        this.detailsTmp2 = []
        this.listTmp2 = row
        row.details2.forEach((v) => {
          this.detailsTmp2.push(v)
        })
        this.actionsTmp3 = row.details3
        if (row.fbillstate == 2) {
          this.$nextTick(() => {
            this.$refs['dataForm'].clearValidate()
          })
        }
  
        this.handleUpdate1()
      },
      updateData() {
        this.$refs['dataForm'].validate((valid) => {
          if (valid) {
            updategoodInfo(this.dataForm, this.$route.query.id)
              .then(() => {
                for (const v of this.list) {
                  if (v.fgoodno === this.dataForm.fgoodno) {
                    const index = this.list.indexOf(v)
                    this.list.splice(index, 1, this.dataForm)
                    break
                  }
                }
                this.dialogFormVisible = false
                this.$notify.success({
                  title: '成功',
                  message: '更新物品资料成功'
                })
              })
              .catch((response) => {
                this.$notify.error({
                  title: '失败',
                  message: response.data.data
                })
              })
          }
        })
      },
      // 标签页
      labelTag(row) {
        this.dataForm = Object.assign({}, row)
        this.dialogFormVisibleLabelTag = true
      },
      handleDelete(row) {
        this.$confirm('是否要删除物品资料', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          deletegoodInfo(row)
            .then((response) => {
              this.$notify.success({
                title: '成功',
                message: '删除物品资料成功'
              })
              const index = this.list.indexOf(row)
              this.list.splice(index, 1)
            })
            .catch((response) => {
              this.$notify.error({
                title: '失败',
                message: response.data.data
              })
            })
        }).catch(() => { })
      },
      indexMethod(index) {
        index = index + 1
        return index
      },
  
      cancel() {
        this.dialogFormVisible = false
        this.list.forEach((v) => {
          if (v.fgoodno === this.dataForm.fgoodno) {
            this.dataForm = this.listTmp
            this.dataForm.details = this.detailsTmp
            this.dataForm.details2 = this.detailsTmp2
            this.dataForm.details3 = this.actionsTmp3
            const index = this.list.indexOf(v)
            this.list.splice(index, 1, this.dataForm)
            return
          }
        })
      },
      // 弹窗点击关闭前的回调
      handleClose() {
        this.dialogFormVisible = false
        this.list.forEach((v) => {
          if (v.fgoodno === this.dataForm.fgoodno) {
            this.dataForm = this.listTmp
            this.dataForm.details = this.detailsTmp
            this.dataForm.details2 = this.detailsTmp2
            this.dataForm.details3 = this.actionsTmp3
            const index = this.list.indexOf(v)
            this.list.splice(index, 1, this.dataForm)
            return
          }
        })
      },
  
      //     addData() {
      //   this.$refs["dataForm1"].validate((valid) => {
      //     if (valid) {
      //       this.dataForm.details.push(this.dataForm1);
  
      //         this.resetForm1()
  
      //         // 清除验证
      //         this.$nextTick(() => {
      //           this.$refs["dataForm1"].clearValidate();
      //         });
  
      //       // 计算行号
      //       let len = this.dataForm.details.length - 1
      //       this.dataForm1.fline = this.dataForm.details[len].fline + 1
  
      //     }
      //   });
      // },
  
      // 子表一添加编辑
      handleEdit1(row) {
        this.dataForm1 = Object.assign({}, row)
      },
      // 子表一编辑保存数据
      edit1Data() {
        this.$refs['dataForm1'].validate((valid) => {
          if (valid) {
            if (this.dataForm.details.length > 0) {
              for (const v of this.dataForm.details) {
                if (v.fline === this.dataForm1.fline) {
                  const index = this.dataForm.details.indexOf(v)
                  this.dataForm.details.splice(index, 1, this.dataForm1)
                  this.isAdd1 = false
                  break
                }
              }
              console.log('2222')
  
              if (this.isAdd1) {
                console.log('111111')
                this.dataForm.details.push(this.dataForm1)
              }
            } else {
              this.dataForm.details.push(this.dataForm1)
            }
  
            this.resetForm1()
            this.isAdd1 = true
  
            // 清除验证
            this.$nextTick(() => {
              this.$refs['dataForm1'].clearValidate()
            })
  
            // 计算行号
            if (this.dataForm.details.length > 0) {
              // 计算行号
              const len = this.dataForm.details.length - 1
              this.dataForm1.fline = this.dataForm.details[len].fline + 1
            } else {
              this.dataForm1.fline = 1
            }
          }
        })
      },
  
      cancle1() {
        this.resetForm1()
        this.isAdd1 = true
  
        // 清除验证
        this.$nextTick(() => {
          this.$refs['dataForm1'].clearValidate()
        })
  
        // 计算行号
        if (this.dataForm.details.length > 0) {
          // 计算行号
          const len = this.dataForm.details.length - 1
          this.dataForm1.fline = this.dataForm.details[len].fline + 1
        } else {
          this.dataForm1.fline = 1
        }
      },
  
      handleUpdate1() {
        this.dialogStatus1 = 'update'
        this.dialogFormVisible1 = true
        this.$nextTick(() => {
          this.$refs['dataForm1'].clearValidate()
        })
      },
  
      handleDelete1(row) {
        const index = this.dataForm.details.indexOf(row)
        this.dataForm.details.splice(index, 1)
        // 计算行号
        if (this.dataForm.details.length > 0) {
          // 计算行号
          const len = this.dataForm.details.length - 1
          this.dataForm1.fline = this.dataForm.details[len].fline + 1
        } else {
          this.dataForm1.fline = 1
        }
      },
  
      // 子表二添加
      addData2() {
        this.$refs['dataForm2'].validate((valid) => {
          if (valid) {
            this.dataForm.details2.push(this.dataForm2)
  
            this.dataForm2 = {
              fgoodno: undefined,
              fimgname: undefined,
              fimgscript: undefined,
              fimage: undefined
            }
  
            // 清除验证
            this.$nextTick(() => {
              this.$refs['dataForm2'].clearValidate()
            })
          }
        })
      },
  
      handleUpdate2() {
        this.dialogStatus2 = 'update'
        this.dialogFormVisible2 = true
        this.dataForm2 = {}
        this.$nextTick(() => {
          this.$refs['dataForm2'].clearValidate()
        })
      },
  
      handleDelete2(row) {
        const index = this.dataForm.details2.indexOf(row)
        this.dataForm.details2.splice(index, 1)
      },
  
      // 物料弹出框
      searchDialogMaterial() {
        this.materialIdVisible = true
        this.materialFsiteNo = this.dataForm.fsiteNo
      },
  
      // 物料弹出框
      materialDialogValue(value) {
        this.dataForm1.fgoodno = value.data.fgoodno
        this.dataForm1.fgoodname = value.data.fgoodname
        this.dataForm1.fbuyprice = value.data.fbuyprice
        this.fbuypriceData = value.data.fbuyprice
        this.dataForm1.fspec = value.data.fspec
        this.dataForm1.funit = value.data.funit
        this.dataForm1.fordunit = value.data.fordunit
      },
  
      // 容器标签
      handleUpdate3() {
        this.dialogStatus3 = 'update'
        this.dialogFormVisible3 = true
        this.dataForm3 = {}
        this.$nextTick(() => {
          this.$refs['dataForm3'].clearValidate()
        })
      },
  
      handleDelete3(row) {
        const index = this.dataForm.details4.indexOf(row)
        this.dataForm.details4.splice(index, 1)
      },
  
      addData3() {
        this.$refs['dataForm3'].validate((valid) => {
          this.dataForm3.fenddate = moment(this.dataForm3.fenddate).format('YYYY-MM-DD')
          this.dataForm3.fbegdate = moment(this.dataForm3.fbegdate).format('YYYY-MM-DD')
          if (valid) {
            this.dialogFormVisible3 = false
            this.dataForm.details4.push(this.dataForm3)
          }
        })
      },
  
      handleDelete4(row) {
        const index = this.dataForm.details4.indexOf(row)
        this.dataForm.details4.splice(index, 1)
      },
      // 图片
      formdata2: function(fpointno) {
        // const formdata = new FormData()
        // formdata.append('fpointno', '123456')
        return { 'ftype': '5', 'fpointno': fpointno }
      },
      handleAvatarSuccess(res, file) {
        // this.dataForm.fimage = URL.createObjectURL(file.raw)
        this.dataForm.fimage = res.data
        const time = new Date().getTime()
        this.heddon = true
        this.dataForm.fimage = `${this.dataForm.fimage}?time=${time}`
      },
  
      beforeAvatarUpload(file) {
        // const isJPG = file.type === 'image/jpeg'
        const isLt2M = file.size / 1024 / 1024 < 2
  
        // if (!isJPG) {
        //   this.$message.error('上传头像图片只能是 JPG 格式!')
        // }
        if (!isLt2M) {
          this.$message.error('上传图片大小不能超过 2MB!')
        }
        return isLt2M // isJPG &&
      }
  
      //* 图片
  
    }
  }
  </script>
  